<template>
        <!-- 底部按钮保存区域 -->
        <div class="footer-btns">
            <div class="btns-container">
                <span class="signature">签名</span>
                <span class="saveHistoryData" @click="footerClick">信息保存</span>
            </div>
        </div>
</template>
  
<script setup>
import { ref, reactive, toRefs } from 'vue';
const emit = defineEmits(["callBackEvent"]);
const footerClick = () =>{
    emit("callBackEvent")
}

</script>

<style scoped>
        .footer-btns {

            position:fixed;
            bottom: 0;
            height: 80px;
            line-height: 75px;
            width: 100%;
            background-color: #f5f8fa;
            border-radius: 20px 20px 0  0;

            .btns-container {
                display: flex;
                align-items: center;
                justify-content: space-between;
                /* padding: 0 8px; */

                span {
                    font-size: 26px;
                    color: rgb(62, 175, 224);
                    font-weight: 600;
                    background-color: #e1f2f9;
                    padding: 8px 15px;
                }

                .signature {
                    border-radius: 0px 15px 15px 0;
                }
                .saveHistoryData {
                    border-radius: 15px 0px 0px 15px;
                }
            }
        }

</style>